import React from 'react'

class Item extends React.Component {
  state = {
    count: 0
  }

  // 商品数量加1
  addHandel = () => {
    this.setState({
      count: this.state.count + 1
    })
    this.props.Total(1)
  }

  // 商品数量减1
  subHandel = () => {
    const { count } = this.state
    if (count <= 0) return
    this.setState({
      count: this.state.count - 1
    })
    this.props.Total(-1)
  }

  render() {
    const { count } = this.state
    const { name } = this.props
    return (
      <div className="item-container">
        <span>【{name}】商品的购买数量是：【{count}】</span>
        <button onClick={this.addHandel}>+</button>
        <button onClick={this.subHandel}>-</button>
      </div>
    )
  }
}

export default Item
